/**
 * @author BoLiang
 */
if (typeof accedo === "undefined") {
	accedo = {};
}
if (typeof accedo.achievement === "undefined") {
	accedo.achievement = {};
}

accedo.achievement.achiPortalFriendsList = {

	friListAjaxNode : null,
	oldOnkeydownFunc : null,
	riListInnerNode : null,
	divCurrID : 0,
	divLength : 0,
	moveCount : 0,
	minLeft : 0,
	maxLeft : 0,

	init : function() {
		this.friListAjaxNode = null;
		this.riListInnerNode = null;
		this.divCurrID = 0;
		this.divLength = 0;
		this.moveCount = 0;
		this.oldOnkeydownFunc = document.onkeydown;
		this.minLeft = 0;
		this.maxLeft = 0;
		document.onkeydown = function(e) {
			accedo.achievement.achiPortalFriendsList.keysControl(e);
		};
	},

	createFriListMain : function(username) {
		this.init(); 

		// create friends list main node
		var friListMainNode = document.createElement("div");
		friListMainNode.id = "friListMain"; 

		// create left and right interval bar node
		var friListLeftBarNode = document.createElement("div");
		friListLeftBarNode.id = "friListLeftBar"; 
		friListLeftBarNode.innerHTML = "<img width=100% height=100% src='http://127.0.0.1:8080/AchiPlugin/achiPortal/images/vIntervalLeft.png' />";
		var friListRightBarNode = document.createElement("div");
		friListRightBarNode.id = "friListRightBar"; 
		friListRightBarNode.innerHTML = "<img width=100% height=100% src='http://127.0.0.1:8080/AchiPlugin/achiPortal/images/vIntervalRight.png' />";

		// create list Ajax node
		this.friListAjaxNode = document.createElement("div");
		this.friListAjaxNode.id = "friListAjax";


		// append all node to friends list main node
		friListMainNode.appendChild(friListLeftBarNode); 
		friListMainNode.appendChild(this.friListAjaxNode);
		friListMainNode.appendChild(friListRightBarNode);
		this.initFri(username); 
		return friListMainNode; 
	},

	initFri : function(username) {
			dwr.engine.setPreHook(this.preHook); 
			dwr.engine.setPostHook(this.postHook); 
			UserService._path = "http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/dwr";
			UserService.getJsonFriendsByUsername(username, this.initFriCallback);
		},
	preHook : function() {
	},
	postHook : function() {
	},
		
	initFriCallback : function(data) {
		var serverDataObj = eval("(" + data + ")");
		accedo.achievement.achiPortalFriendsList.friListAjaxNode
			.appendChild(accedo.achievement.achiPortalFriendsList.createFriListNode(serverDataObj));

	},

	createFriListNode : function(serverDataObj) {
		// create friends list node
		var friListNode = document.createElement("div");
		friListNode.id = "friList";

		// create up arrow and down arrow
		var friListUpArrowNode = document.createElement("div"); 
		friListUpArrowNode.id = "friListUpArrow";
		this.friListUpArrow = document.createElement("div");
		this.friListUpArrow.id = "friListArrowInner";
		this.friListUpArrow.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/achiPortal/images/upArrow.png' />";
		this.friListUpArrow.style.visibility = "hidden";
		friListUpArrowNode.appendChild(this.friListUpArrow); 


		var friListDownArrowNode = document.createElement("div"); 
		friListDownArrowNode.id = "friListDownArrow";  
		this.friListDownArrow = document.createElement("div");
		this.friListDownArrow.id = "friListArrowInner";
		this.friListDownArrow.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/achiPortal/images/downArrow.png' />";
		friListDownArrowNode.appendChild(this.friListDownArrow); 

		this.minLeft = 512 - (serverDataObj.friends.length * 102);
		this.maxLeft = 0;
		if (this.minLeft >= 0) {
			this.friListDownArrow.style.visibility = "hidden";
		}


		// append the nodes
		friListNode.appendChild(friListUpArrowNode); 
		friListNode.appendChild(this.createFriListCell(serverDataObj)); 
		friListNode.appendChild(friListDownArrowNode); 

		return friListNode; 
	},

	createFriListCell : function(serverDataObj) {
		// create friends list container node
		var friListCtnNode = document.createElement("div");
		friListCtnNode.id = "friListCtn";

		this.friListInnerNode = document.createElement("div");
		this.friListInnerNode.id = "friListInner";
		this.divLength = serverDataObj.friends.length;
		this.friListInnerNode.style.height = this.divLength * 102 + "px";

		for (var friNum = 0; friNum < this.divLength; friNum++) {
			var friCellNode = document.createElement("div");
			friCellNode.id = "friListCell" + friNum;
			friCellNode.className = "friListCell";

			var friCellAvatar = document.createElement("div");
			friCellAvatar.id = "friCellAvatar";
			friCellAvatar.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":"
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/images/userImages/user"
					+ serverDataObj.friends[friNum].friend_id
					+ ".png' />";
			var friCellName = document.createElement("div");
			friCellName.id = "friCellName";
			friCellName.innerHTML = "<font color=white>"
							  + serverDataObj.friends[friNum].friend_name
							  + "</font>"
							  + "<hidden id='friListCellHidden" + friNum + "'"
							  + "value='"+ serverDataObj.friends[friNum].friend_name + "'/>";
			friCellNode.appendChild(friCellAvatar); 
			friCellNode.appendChild(friCellName); 

			var hIntervalNode = document.createElement("div");
			hIntervalNode.id = "hInterval";
			hIntervalNode.innerHTML = "<img width=100% height=100% src='http://127.0.0.1:8080/AchiPlugin/achiPortal/images/hInterval.png' />"
			this.friListInnerNode.appendChild(friCellNode); 
			this.friListInnerNode.appendChild(hIntervalNode); 

		}


		friListCtnNode.appendChild(this.friListInnerNode);
		return friListCtnNode;
	},

	moveCurrDiv : function(direction) {
		var divOldNode = document.getElementById("friListCell" + this.divCurrID);
		if (direction == "down" && this.divCurrID < this.divLength - 1) {
			this.divCurrID = this.divCurrID + 1;
			var divNewNode = document.getElementById("friListCell" + this.divCurrID);
			divOldNode.style.borderColor = "#666666";
			divOldNode.style.backgroundColor = null;

			divNewNode.style.borderColor = "white";
			divNewNode.style.backgroundColor = "#FF6600";

			if (this.moveCount == 4) {
				var topValue = this.friListInnerNode.offsetTop - 102;
				this.friListInnerNode.style.top = topValue + "px";
					
					if (topValue <= this.minLeft) {
						this.friListDownArrow.style.visibility = "hidden"; 
					}
					
					if (topValue < this.maxLeft) {
						this.friListUpArrow.style.visibility = "visible"; 
					}
			} else {
				this.moveCount++;
			}

		} else if (direction == "up" && this.divCurrID > 0) {
			this.divCurrID = this.divCurrID - 1;
			var divNewNode = document.getElementById("friListCell" + this.divCurrID);
			divOldNode.style.borderColor = "#666666";
			divOldNode.style.backgroundColor = null;

			divNewNode.style.borderColor = "white";
			divNewNode.style.backgroundColor = "#FF6600";

			if (this.moveCount == 0) {
				var topValue = this.friListInnerNode.offsetTop + 102;
				this.friListInnerNode.style.top = topValue + "px";
					
					if (topValue >= this.maxLeft) {
						this.friListUpArrow.style.visibility = "hidden"; 
					}
					
					if (topValue > this.minLeft) {
						this.friListDownArrow.style.visibility = "visible"; 
					}
			} else {
				this.moveCount--;
			}
		}
	},

	keysControl : function(e) {
		e = window.event || e;
		switch (e.keyCode) {
		// up button
		case 38:
			this.moveCurrDiv("up");
			break;
		// down button
		case 40:
			this.moveCurrDiv("down");
			break; 
		// enter button
		case 13:

			var idName = "friListCellHidden" + this.divCurrID; 
			var hiddenNode = document.getElementById(idName);
			var hiddenValue = hiddenNode.getAttribute("value");
			accedo.achievement.achiPortalFriendsMain.portalFriMainNode.appendChild(
					accedo.achievement.achiPortalFriendsDetail.appendFriendsDetailDiv(hiddenValue));
			break;
		// esc button
		case 27:
			document.onkeydown = function(e) {
				accedo.achievement.achiPortalShow.titleKeysControl(e);
			};
			var newSocialButton = document.getElementById("social" + accedo.achievement.achiPortalShow.divTitleCurrID);
			newSocialButton.style.borderColor = "yellow";
			break;
		default:
			break;
		}
	}


};